var path = require('path');
// var webpack = require('webpack');
// // var ExtractTextPlugin = require("extract-text-webpack-plugin");
// var HtmlWebpackPlugin = require('html-webpack-plugin');
// var node_modules = path.resolve(__dirname, 'node_modules');
// var pathToReact = path.resolve(node_modules, 'react/dist/react.min.js');
// var pathToReactDom = path.resolve(node_modules, 'react-dom/dist/react-dom.min.js');
// console.log("这里是路径：",path.resolve(__dirname, './app/routes'));
// module.exports = {
//     entry: [
//         // 'webpack/hot/dev-server',
//         path.resolve(__dirname, './app/routes')
//     ],
//     output: {
//         path: path.resolve(__dirname, './build'),
//         filename: 'js/bundle.js',
//         // publicPath:'http://localhost:8181/',         //同样可以
//         publicPath:'/',
//         chunkFilename: "js/[name].bundle.min.js?ver=[chunkhash]"
//     },
//     devServer:{
//         // contentBase: '',  //静态资源的目录 相对路径,相对于当前路径 默认为当前config所在的目录
//         // devtool: 'eval',
//         // hot: true,        //自动刷新
//         inline: true,    
//         port: 8181        
//     },
//     module: {
//         loaders: [
//             {
//                 test: /\.(js|jsx)$/,
//                 exclude: /^node_modules$/,
//                 loader: 'babel',
//             },
//             // { 
//             //     test: /\.(css|scss)$/, 
//             //     loader: ExtractTextPlugin.extract("style", "css!sass!postcss")
//             // }
//             // ,
//             {
//                 test: /\.(png|jpg|jpeg|gif|eot|woff|svg|ttf|woff2|appcache)(\?|$)/,
//                 exclude: /^node_modules$/,
//                 loader: 'file-loader?name=img/[name].[ext]'
//             }
//         ]
//     },
//     resolve:{
//         alias: {
//           'react': pathToReact,
//           'react-dom':pathToReactDom
//         },
//         extensions: ['', '.js', '.jsx'], //后缀名自动补全
//     },
//     /* 
//     *   HtmlWebpackPlugin 这里会自动生成css和js文件,自己在build文件下创建的css文件和js文件目前未用到,但是先不删除,以防后期有变 
//     *   有模板html文件,这样原先的 页面跳转了，title不能改变的问题
//     */
//     plugins: [
//         new webpack.ProvidePlugin({
//             React: 'react',
//             ReactDOM: 'react-dom'
//         }),
//         new webpack.optimize.UglifyJsPlugin({minimize: true}),      //使用uglifyJs压缩js代码
//         new webpack.optimize.OccurenceOrderPlugin(),                //按引用频度来排序 ID，以便达到减少文件大小的效果
//         // new webpack.HotModuleReplacementPlugin(),                   //开启全局的 HMR 能力
//         new webpack.optimize.CommonsChunkPlugin('js/common.js'),
//         // new ExtractTextPlugin("css/[name].css"),
//         // new ExtractTextPlugin("css/[name].[contenthash:6].css",{allChunks: true}),
//         new HtmlWebpackPlugin({
//             filename: 'index.html',
//             template: `${__dirname}/build/index.html`,
//             inject: 'body',
//             hash: true
//         })
//     ]
// };


const HtmlWebpackPlugin = require('html-webpack-plugin')
const CompressionPlugin = require("compression-webpack-plugin")
module.exports = {
    mode: 'development',
    entry: {
        app: './src/index.js'
    },
    output: {
        path: path.resolve(__dirname, './dist'),
        filename: '[name].bundle.js',
    },
    plugins: [
        new HtmlWebpackPlugin({
        	//模板路径，注意需要和index.html路径对应
            template: path.resolve(__dirname, './public/index.html'),
            //文件名称
            filename: 'index.html',
        }),
        new CompressionPlugin({
                  test: /\.js$|\.css$|\.html$|\.jpg$|\.jpeg$|\.png$/, //匹配文件名
                  threshold: 10240, //对超过10k的数据压缩
                  deleteOriginalAssets: false, //不删除源文件
                  minRatio: 0.8,
                  algorithm: 'gzip'
                }),
    ],
    module: {
        rules: [
            {
                test: /\.(png|svg|jpg|jpeg|gif)$/i,
                type: 'asset/resource',
              },
            {
                test: /\.css$/i,
                use: ["style-loader", "css-loader"],
              },
            {
                test: /\.(js|jsx)$/,
                loader: 'babel-loader',
                exclude: /node_modules/
            },{
                test: /\.s[ac]ss$/i,
                use: [
                  // 将 JS 字符串生成为 style 节点
                  'style-loader',
                  // 将 CSS 转化成 CommonJS 模块
                  'css-loader',
                  // 将 Sass 编译成 CSS
                  'sass-loader',
                ],
              },
        ],
    }

    // configureWebpack: {
    //     optimization: {
    //       minimizer: [
    //         new UglifyJsPlugin({
    //           uglifyOptions: {
    //             // 删除注释
    //             output: {
    //               comments: false
    //             },
    //             // 删除console debugger 删除警告
    //             compress: {
    //               drop_console: true, //console
    //               drop_debugger: false,
    //               pure_funcs: ['console.log'] //移除console
    //             }
    //           }
    //         })
    //       ]
    //     }
    //   }
}